<template>
  <div>
    <div @keyup.enter="getData()">
      <el-form :inline="true">
        <el-form-item>
          <el-input v-model="params.customer_name" placeholder="项目名称查询" clearable></el-input>
        </el-form-item>
        <el-form-item>
          <el-input
            v-model="params.corp_name"
            placeholder="负责人查询"
            :clearable="true"
          ></el-input>
        </el-form-item>
        <el-form-item>
          <select-address
            v-model="params.address_code"
            clearable
            placeholder="地址查询"
            :auto-top="true"
            @change="getData()"
          ></select-address>
        </el-form-item>
        <el-form-item>
          <el-button @click="getData()">查询</el-button>
        </el-form-item>
      </el-form>
    </div>
    <c-table
      border
      v-loading="loading"
      :stripe="false"
      :columns="tableColumns"
      :data="tableData"
      :height="dialogHeight"
    ></c-table>
    <div class="query-pagination">
      <div></div>
      <el-pagination
        layout="total, prev, pager, next, jumper"
        :current-page.sync="params.index"
        :page-size="params.size"
        :total="totalCount"
        @current-change="getData"
      ></el-pagination>
    </div>
    <el-dialog
      :visible.sync="reportVisible"
      :close-on-click-modal="false"
      append-to-body
      top="30px"
      width="80%"
    >
      <el-tabs v-model="active">
        <el-tab-pane label="放款审批表" name="first">
          <loan-approve-self-view
            v-if="+relatedData.gua_type === 2"
            :query-id="queryId"
            :view-mode="true"
          ></loan-approve-self-view>
          <loan-approve-view v-else :query-id="queryId"></loan-approve-view>
        </el-tab-pane>
        <el-tab-pane label="合同审批表">
          <contract-approve
            :query-id="queryId"
            :process-status="relatedData.process_status"
            view-mode
          ></contract-approve>
        </el-tab-pane>
        <el-tab-pane label="项目审批表">
          <investigate-approve-view
            :query-id="queryId"
            :process-status="relatedData.process_status"
          ></investigate-approve-view>
        </el-tab-pane>
        <el-tab-pane label="合同附件" name="contract">
          <contract-guard-view :query-id="queryId"></contract-guard-view>
        </el-tab-pane>
        <el-tab-pane label="担保意向函" v-if="+relatedData.ele_letter_status > 0" name="letter">
          <letter-view :query-id="queryId"></letter-view>
        </el-tab-pane>

        <el-tab-pane label="附件">
          <attach-view :queryId="queryId" :visible="reportVisible"></attach-view>
        </el-tab-pane>
      </el-tabs>
    </el-dialog>
    <loan-approve-main
      :visible.sync="editVisible"
      @success="handleSuccess()"
      :queryId="editQueryId"
    ></loan-approve-main>

    <loan-approve-self
      :visible.sync="editSelfVisible"
      @success="handleSuccess()"
      :queryId="editSelfQueryId"
    ></loan-approve-self>
  </div>
</template>

<script>
import { enumProcessStatus, enumGuatype } from '@/credit/plugins/enumTown'
import taskTableMixin from '@/credit/mixin/task/taskTable'
import SelectAddress from '@/components/select/SelectAddress'
import LoanApproveMain from '@/credit/views/county/unionProvince/components/loanApprove/MainDialog'
import LoanApproveView from '@/credit/views/county/unionProvince/components/loanApprove/LoanApproveView'
import InvestigateApproveView from '@/credit/views/county/unionProvince/components/InvestigateApproveView'
import LetterView from '@/credit/views/county/unionProvince/components/LetterView'
import ContractApprove from '@/credit/views/county/unionProvince/components/contractApprove/Main'
import ContractGuardView from '@/credit/views/county/unionProvince/components/ContractGuardView'
import AttachView from '@/credit/components/AttachView'
import LoanApproveSelf from '@/credit/views/city/self/components/loanApprove/MainDialog'
import LoanApproveSelfView from '@/credit/views/city/self/components/loanApprove/Main'
export default {
  components: {
    SelectAddress,
    LoanApproveMain,
    LoanApproveView,
    LetterView,
    ContractGuardView,
    InvestigateApproveView,
    AttachView,
    ContractApprove,
    LoanApproveSelf,
    LoanApproveSelfView,
  },
  mixins: [taskTableMixin],
  data() {
    return {
      params: {
        index: 1,
        size: 10,
      },
      tableColumns: [
        {
          attrs: { label: '主体名称', prop: 'customer_name', minWidth: 135 },
          process: (v, row) => ({
            attrs: { class: 'project-history', attrs: { 'data-history': row.is_history } },
          }),
        },
        { attrs: { label: '负责人', prop: 'corp_name', align: 'center' } },
        { attrs: { label: '地址', prop: 'address', minWidth: 135 } },
        { attrs: { label: '联系电话', prop: 'mobile_no', align: 'center', minWidth: 120 } },
        { attrs: { label: '放款金额(万元)', prop: 'reply_funds', align: 'center' } },
        { attrs: { label: '审批模式', prop: 'processLabel', width: 110, align: 'center' } },
        {
          attrs: { label: '操作', align: 'center', width: 100 },
          operations: [
            {
              content: '审批',
              icon: 'fa fa-gavel',
              event: this.handleEdit,
              ifRender: row => +row.task_status === 0,
            },
            {
              content: '查看',
              icon: 'fa fa-search',
              event: this.handleView,
            },
          ],
        },
      ],
      tableData: [],
      loading: false,
      totalCount: 0,
      editQueryId: '',
      editVisible: false,
      active: 'first',
      reportVisible: false,
      queryId: '',
      relatedData: {},
      editSelfVisible: false,
      editSelfQueryId: '',
    }
  },

  created() {},
  methods: {
    dataAdapter(item) {
      if (+item.gua_type === 4) {
        item.processLabel = enumProcessStatus[+item.process_status] || ''
      } else {
        item.processLabel = enumGuatype[item.gua_type]
      }
      return item
    },
    handleSuccess(res) {
      this.$store.dispatch('getMyTaskCount')
      this.$emit('success', res)
    },
    handleEdit(row = {}) {
      if (+row.gua_type === 2) {
        this.editSelfVisible = true
        this.editSelfQueryId = row.customer_related_id
      } else {
        this.editQueryId = row.customer_related_id
        this.editVisible = true
      }
    },
    handleView(row = {}) {
      this.active = 'first'
      this.queryId = row.customer_related_id
      this.relatedData = row
      this.reportVisible = true
    },
  },
}
</script>
<style lang="scss" scoped></style>
